<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>边框属性</title>
		<style>
			
		div{
			width: 500px;
			height: 500px;
			/* 边框复合属性：属性值可以作为属性使用 */
			border: 1px soild red;
			/* 效果：1像素实线红色边框
			 作用：①展示效果 ②确定元素是否选中【验证】*/
			 /* 边框宽度属性：数值px */
			 border-width: 5px;
			 /* 边框方向属性：数值px */
			 
			 border-bottom-width: 10px;
			 dorder-left-width: 10px;
			 border-right-width: 10px;
			 border-top-width: 10px;
			 /* 边框样式属性：实线、点线、双实线、虚线 */
			 border-style: solid;
			/* 边框颜色属性：十六进制色值 */
			border-color:#00f;
			 
			
			 
			  
						   /* 边框颜色属性：十六进制色值 */
						    border-color:rgba(170, 0, 0, 0.9);
							border-left-color:rgba(170, 0, 0, 0.9);
							border-right-color:rgba(255, 255, 0, 0.9);
							border-bottom-color:rgba(0, 0, 0, 0.9);
						 
						   /* 复杂边框：边框倒角 border-radius 属性 */
						  border-radius: 0px 10px 0px 0px;
						  
		}
		</style>
	</head>
	<body>
		<div></div>
	</body>
</html>